<form [formGroup]="form" (ngSubmit)="onSubmit()">
	<ion-header [translucent]="true">
		<ion-toolbar>
			<ion-buttons slot="start">
				<ion-button (click)="close()">
					<ion-icon slot="start" name="close-circle"></ion-icon>
					关闭
				</ion-button>
			</ion-buttons>
			<ion-title>设置</ion-title>
			<ion-buttons slot="end">
				<ion-button type="submit" color="primary" [disabled]="!form?.valid">
					<ion-icon slot="start" name="checkmark-circle"></ion-icon>
					确定
				</ion-button>
			</ion-buttons>
		</ion-toolbar>
	</ion-header>

	<ion-header collapse="condense">
		<ion-toolbar>
			<ion-title size="large">设置</ion-title>
		</ion-toolbar>
	</ion-header>

	<ion-list>
		<ion-item>
			<ion-icon name="layers" slot="start"></ion-icon>
			<ion-label>数据库端口号</ion-label>
			<ion-input formControlName="port" type="number"></ion-input>
			<app-item-error [form]="form" name="port"></app-item-error>
		</ion-item>
		<ion-item>
			<ion-icon name="settings" slot="start"></ion-icon>
			<ion-label>配置页端口号</ion-label>
			<ion-input formControlName="webPort" type="number"></ion-input>
			<app-item-error [form]="form" name="webPort"></app-item-error>
		</ion-item>
		<ion-item>
			<ion-icon name="list" slot="start"></ion-icon>
			<ion-label>最大查询行数</ion-label>
			<ion-input formControlName="defaultLimit" type="number"></ion-input>
			<app-item-error [form]="form" name="defaultLimit"></app-item-error>
		</ion-item>
	</ion-list>
</form>
